The `withMessageOptions(options)` method is used to configure what goes into the messages in the conversation, which
could be prompts from the user or responses from the AI. The options object should have properties from the table
listed below.

> * Type: `MessageOptions`

```tsx
type MessageOptions<AiMsg = string> = {
    responseRenderer?: ResponseRenderer<AiMsg>;
    promptRenderer?: PromptRenderer;
    syntaxHighlighter?: HighlighterExtension;
    htmlSanitizer?: SanitizerExtension;
    markdownLinkTarget?: 'blank' | 'self';
    showCodeBlockCopyButton?: boolean;
    streamingAnimationSpeed?: number;
    skipStreamingAnimation?: boolean;
    waitTimeBeforeStreamCompletion?: number | 'never';
};

// Refer to custom renderers API documentation for more information
type ResponseRenderer<AiMsg> = (content: ResponseRendererProps<AiMsg>) => HTMLElement | null;
type PromptRenderer = (content: PromptRendererProps) => HTMLElement | null;
```

| Property | Type |  Default |Description |
| --- | --- | --- | --- |
| `responseRenderer` | `ResponseRenderer<AiMsg>` | - | A custom renderer for AI responses. API documentation  for custom renderers can be found [here](/reference/ui/custom-renderers). |
| `promptRenderer` | `PromptRenderer` | - | A custom renderer for user prompts. API documentation for custom renderers can be found [here](/reference/ui/custom-renderers). |
| `syntaxHighlighter` | `HighlighterExtension` | - | A custom syntax highlighter for code blocks within messages. |
| `htmlSanitizer` | `SanitizerExtension` | - | A custom HTML sanitizer for HTML and parsed markdown. It does not apply to preformatted code blocks. Use a syntax highlighter for code blocks. |
| `markdownLinkTarget` | `'blank'`&nbsp;\|&nbsp;`'self'` | `'blank'` | The target attribute for markdown links. Use `self` to open links in the same tab and `blank` to open links in a new tab. |
| `showCodeBlockCopyButton` | `boolean` | `true` | If `true`, a copy button will be displayed on code blocks created withing messages. |
| `streamingAnimationSpeed` | `number` | `10` | The interval in milliseconds between streamed AI responses. |
| `skipStreamingAnimation` | `boolean` | `false` | If `true`, streamed AI responses will be displayed instantly without any animation. |
| `waitTimeBeforeStreamCompletion` | `number`\|`'never'` | `2000` | Sets the wait time in milliseconds after the last data chunk; 'never' requires manual completion. |

* Usage:
